<template>
    <div style="height: 100%">
        <div class="outDiv">
            <div class="imgDiv">
                <div class="textDiv">
                    <p> 凄凄复凄凄，嫁娶不须啼。</p>
                    <p> 愿得一心人，白头不相离。</p>
                    <p> 竹竿何袅袅，鱼尾何簁簁！</p>
                    <p> 男儿重意气，何用钱刀为！</p>
                </div>
            </div>
        </div>
    </div>
</template>

<script>
    export default {
        name: "index.vue"
    }
</script>

<style>

    .outDiv {
        height: 100%;
    }

    .imgDiv {
        background-image: url("http://static.runoob.com/images/demo/demo1.jpg");
        width: 45%;
        height: 25%;
        margin: 0 auto;
        padding-top: 80px;
    }

    .textDiv{
        width: 426px;
        height: 70%;
        border: 2px dotted white;
        background-color:darkgray;
        opacity: 0.7;
        margin: auto;
        color: #fff;
        text-align: center;
        padding-top: 10px;
    }

</style>